<template>
    <div style="margin:20px;padding:20px;background-color:#fff;">
        <el-button type="primary" size="small" @click="goAdd" style="margin-bottom:10px;">添加客户</el-button>
        <el-button type="info" size="small" @click="goBlackList" style="margin-bottom:10px;float:right">查看黑名单</el-button>
        <el-form :inline="true" class="demo-form-inline" size="small">
            <el-form-item label="所属公司">
                <el-input v-model="s_company_name" placeholder="请输入" clearable></el-input>
            </el-form-item>
            <el-form-item label="客户姓名">
                <el-input v-model="s_user_name" placeholder="请输入" clearable></el-input>
            </el-form-item>
            <el-form-item label="手机号">
                <el-input v-model="s_phone" maxlength="11" placeholder="请输入" clearable></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="onSubmit">查询</el-button>
            </el-form-item>
        </el-form>
        <el-table :data="tableInfo" size="small">
            <el-table-column prop="index" label="序号"></el-table-column>
            <el-table-column prop="company" label="所属公司"></el-table-column>
            <el-table-column prop="customer" label="客户姓名"></el-table-column>
            <el-table-column prop="phone" label="手机号"></el-table-column>
            <el-table-column prop="ownership" label="虚拟归属"></el-table-column>
            <el-table-column prop="area" label="区域"></el-table-column>
            <el-table-column prop="remark" label="备注"></el-table-column>
            <el-table-column label="操作">
                <template slot-scope="scope">
                    <el-button type="text" @click="goWrite" size="small">修改</el-button>
                    <el-button type="text" @click="goDelete" size="small">删除</el-button>
                    <el-button type="text" @click="goBlackList" size="small">拉黑</el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
    
</template>

<script>
    export default {
        data() {
            return {
                s_company_name:'',
                s_user_name:'',
                s_phone:'',
                tableInfo:[
                    {
                        "index":1,
                        "company":"江南皮革厂",
                        "customer":"马天宇",
                        "phone":13576725708,
                        "id":10086,
                        "ownership":"北京",
                        "area":"浙江",
                        "remark":"江南皮革厂倒闭了"
                    }
                ]
            }
        },
        methods: {
            onSubmit() {
                console.log('submit!');
            },
            goAdd(){
                this.$router.push("/customer-list/add")
            },
            goWrite(){
                this.$router.push("/customer-list/edit")
            },
            goDelete(){

            },
            goBlackList(){
                
            }
        },
    }
</script>

<style scoped>

</style>